<template>
  <div class="tableList">
    <el-table :data="tableData" v-loading="loading">
      <el-table-column show-overflow-tooltip fixed label="序号" type="index" width="55">
      </el-table-column>
      <el-table-column show-overflow-tooltip fixed label="联系人" prop="linkName">
      </el-table-column>
      <el-table-column show-overflow-tooltip label="联系方式" prop="linkPhone"></el-table-column>
      <el-table-column show-overflow-tooltip label="创建时间" prop="createTime"> </el-table-column>
      <el-table-column show-overflow-tooltip label="派单时间" prop="taskTime"> </el-table-column>
      <el-table-column show-overflow-tooltip label="完成时间" prop="updateTime"> </el-table-column>
      <el-table-column
        show-overflow-tooltip
        label="问题描述"
        prop="problemDescription"
      ></el-table-column>
      <el-table-column
        show-overflow-tooltip
        label="大模型转述"
        prop="moxingParaphrase"
      ></el-table-column>
      <el-table-column show-overflow-tooltip label="状态" prop="status">
        <template #default="scope">
          {{ dealStatus(scope.row.status) }}
        </template>
      </el-table-column>

      <el-table-column width="125" label="操作" fixed="right" header-align="center">
        <template #default="scope">
          <el-button
            type="primary"
            v-if="scope.row.status === 1"
            @click="handleDispatch(scope.row)"
            link
            >派单</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <DispatchPop ref="dispatchRef" @submitFun="submitFun" />
    <Pagination
      v-show="total > 0"
      :total="total"
      v-model:page="queryParams.page"
      v-model:limit="queryParams.pageSize"
    />
  </div>
</template>

<script setup lang="ts">
import { useRouter } from 'vue-router'
import { useAuthStore } from '@/stores/auth.js'
import { ElMessageBox } from 'element-plus'
import { getProblemListAPI } from '@/api/home.js'
import Pagination from '@/components/Pagination/index.vue'
import DispatchPop from '../PopCom/DispatchPop.vue'
import { Select } from '@element-plus/icons-vue'
const authStore = useAuthStore()
const router = useRouter()
const tableData = ref([])
const total = ref(0)
const loading = ref(false)
const dispatchRef = ref(null)
const queryParams = ref({
  pageSize: 10,
  page: 1,
  status: 1,
})
const dealStatus = (state) => {
  switch (state) {
    case 1:
      return '未派单'
    case 2:
      return '处理中'

    case 3:
      return '已解决'
    case 4:
      return '未解决'
    case 5:
      return '逾期'
    default:
      return ''
  }
}
const submitFun = () => {
  getList()
}
const handleDispatch = (data) => {
  dispatchRef.value.open(data)
}

watch(
  () => {
    return queryParams
  },
  () => {
    getList()
  },
  {
    deep: true,
    immediate: true,
  },
)

/** 查询列表 */
function getList() {
  loading.value = true
  getProblemListAPI(queryParams.value).then((res) => {
    tableData.value = res.data.items
    total.value = res.data.total
    loading.value = false
  })
}
</script>
<script lang="ts">
export default {
  name: 'rulebase',
}
</script>
<style lang="scss" scoped>
.tableList {
}
</style>
